<template>
  <Table :tableData="tableData"  max-height="500px"
         border
         :headerStyle="{backgroundColor:'#fffbed'}" :table-column="tableColumn" :page="false"/>
</template>

<script>
import {paymentDetail} from '@/api/postLoan'

export default {
  props:['routesQuery'],
  name: "paymentDetails",
  data() {
    return {
      tableData: [],
      tableColumn: [
        {label: this.$t('订单编号'), prop: 'loanRecordId', align: 'center', minWidth: 150},
        {label: this.$t('用户姓名'), prop: 'name', align: 'center', minWidth: 100},
        {label: this.$t('手机号'), prop: 'phone', align: 'center', minWidth: 100},
        {label: this.$t('身份证'), prop: 'idCard', align: 'center', minWidth: 100},
        {label: this.$t('合同金额'), prop: 'passAmount', align: 'center', minWidth: 100},
        {label: this.$t('打款金额'), prop: 'dealAmount', align: 'center', minWidth: 100},
        {label: this.$t('银行名称'), prop: 'cardIssuingBank', align: 'center', minWidth: 150},
        {label: this.$t('银行账号'), prop: 'bankNo', align: 'center', minWidth: 150},
        {label: this.$t('打款完成时间'), prop: 'dealTime', align: 'center', minWidth: 150},
        {label: this.$t('APP名称'), prop: 'appName', align: 'center', minWidth: 100},
      ]
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    async getList() {
      const {orderId} = this.routesQuery
      const res = await paymentDetail({
        loanRecordId: orderId
      })
      if (res.code === 1 && res.data) {
        this.tableData = [res.data]
      }
    }
  }
}
</script>

<style scoped>

</style>
